<template>
  <div id="menu">
    <el-row>
        <el-col :span="24">
            <div class="top">
                <div class="back" @click="back()">退出</div>
                <div>主页</div>
                <!-- <div class="launch">发布投票</div> -->
            </div>
        </el-col>
        <el-col :span="8" class="block">
            <i class="el-icon-tickets" @click="look()"></i>
        </el-col>
        <el-col :span="8" class="block">
            <i class="el-icon-edit-outline" @click="look()"></i>
        </el-col>
        <el-col :span="8" class="block">
            <i class="el-icon-setting" @click="look()"></i>
        </el-col>
    </el-row>
    <!-- <el-row class="bottom">
      <div class="list" @click="launch()">
            发起投票
        </div>
    </el-row> -->
  </div>
</template>

<style>
    body{
        margin: 0px;
    }
    #menu .list{
        padding: 8px;
        background-color: #409EFF;
        color: white;
        margin-bottom: 8px;
        border-radius: 8px;
    }
    #menu .bottom{
        position: fixed;
        bottom: -8px;
        width: 100%;
    }
    #menu .top{
        padding: 8px;
        background-color: #409EFF;
        color: white;
        margin-bottom: 8px;
        text-align: center;
    }
    #menu .top .launch{
        position: absolute;
        right: 8px;
        top: 8px;
    }
    #menu .top .back{
        position: absolute;
        left: 8px;
        top: 8px;
    }
    #menu table th{
        text-align: center!important;
    }
    #menu .block{
        border: 1px solid;
        height: 120px;
        line-height: 120px;
        text-align: center;
        font-size: 36px;
    }
</style>

<script>

import router from '../router'

export default {
  name: 'menu',
  data () {
    return {
    }
  },
  methods: {
    look () {
      router.push('/main')
    },
    back () {
      router.go(-1)
    }
  }
}
</script>
